/**
 * 弹出添加用户信息框
 */
function addUser() {
    layer.open({
        type: 1,
        title: '新增用户信息',
        closeBtn: 1, //显示关闭按钮
        shadeClose: true,
        area: ['893px', '400px'],
        content: $("#div_add")
    });
}
/***
 * 删除用户信息
 */
function deleteUser(uid) {
    layer.confirm('确认要删除这个用户吗？', {
        btn: ['是', '否'] //按钮
    }, function() {
        let url = "http://localhost:28001/user/" + uid;
        $.ajax({
            url: url,
            type: "delete",
            contentType: "application/json;charset=utf-8",
            data: '{}',
            success: function(msg) {
                layer.msg(msg, function() {
                    initData();
                });
                layer.closeAll();
            },
            error: function(xhr, textstatus, thrown) {}
        });
        layer.closeAll();
    }, function() {});

}
/**
 * 弹出更新用户框
 * @param {工号} no 
 */
function update(uid) {
    $("#hidNo").val(uid);
    layer.open({
        type: 1,
        title: '修改用户信息',
        closeBtn: 1, //显示关闭按钮
        shadeClose: true,
        area: ['893px', '400px'],
        content: $("#div_add")
    });
    loadUser(uid);
}

function loadUser(uid) {
    let name = $("#txtname").val();
    let url = "http://localhost:28001/user/detail/" + uid;
    $.get(url, '', function(data, status, xhr) {
        let obj = JSON.parse(data);
        $("#name").val(obj.username);
        $("#password").val(obj.pASSWORD);
        $("#phone").val(obj.phone);
        $("#hidNo").val(obj.uid);
    }, "json");
}
/**
 * 加载一条用户数据
 */
function initData() {
    let name = $("#txtname").val();
    let url = "http://localhost:28001/user/list";
    let data = { "username": encodeURIComponent(name) };
    $.get(url, data, function(data, status, xhr) {
        let obj = JSON.parse(data);
        let html = '';
        for (let i = 0; i < obj.length; i++) {
            let uid = obj[i].uid;
            let name = obj[i].username;
            let password = obj[i].pASSWORD;
            let phone = obj[i].phone;
            let createtime = obj[i].createtime;
            html += `<tr>
                <td name="name">${name}</td>
                <td name="password">${password}</td>
                <td name="phone">${phone}</td>
                <td name="createtime">${createtime}</td>
                <td>
                    <button class="btn btn-link" onclick="update('${uid}')">编辑</button>
                    <button class="btn btn-link" onclick="deleteUser('${uid}')">删除</button>
                </td>
            </tr>`;
        }
        $("#tbody").html(html);
    }, "json");
}
/**
 * 提交数据
 */
function submit() {
    let no = $("#hidNo").val();
    let name = $("#name").val();
    if (name.trim() === "") {
        layer.msg('用户名不能为空', { icon: 2, time: 2000 });
        $("#name").focus();
        return false;
    }
    let phone = $("#phone").val();
    if (phone.trim() === "") {
        layer.msg('电话不能为空', { icon: 2, time: 2000 });
        $("#phone").focus();
        return false;
    }
    let password = $("#password").val();
    if (password.trim() === "") {
        layer.msg('密码不能为空', { icon: 2, time: 2000 });
        $("#password").focus();
        return false;
    }
    let url = "http://localhost:28001/user";
    let data = {
        "uid": no,
        "PASSWORD": password,
        "phone": phone,
        "username": name
    };
    $.ajax({
        url: url,
        type: "post",
        contentType: "application/json;charset=utf-8",
        data: JSON.stringify(data),
        success: function(msg) {
            layer.msg(msg, function() {
                initData();
            });
            //不管是新增还是更新后都清空表单
            $("#name").val('');
            $("#password").val('');
            $("#phone").val('');
            $("#hidNo").val('');
            layer.closeAll();
        },
        error: function(xhr, textstatus, thrown) {}
    });
}

/**
 * 查询用户信息
 */
function query() {
    initData();
}

$(function() {
    initData();
    /**
     * 绑定新增按钮事件
     */
    $("#btnAdd").click(function() {
        addUser();
    });
    /**
     * 绑定查询按钮事件方法
     */
    $("#btnQuery").click(function() {
        query();
    });
    /**
     * 绑定提交按钮事件方法
     */
    $("#btn_submit").click(function() {
        submit();
    });
});